//转运历史仓租
<template>
  <a-table
    :data-source="transferTable"
    :pagination="false"
    :scroll="{ x: 1500 }"
    class="checkTable"
  >
    <!-- 入库仓库 -->
    <a-table-column
      key="warehousingId"
      data-index="warehousingId"
      align="center"
      width="8%"
    >
      <span slot="title">入库仓库</span>
      <template slot-scope="text, record">
        <span>{{ record.warehouseName }}</span>
      </template>
    </a-table-column>
    <!-- 订单编号 -->
    <a-table-column
      key="ordeCode"
      data-index="ordeCode"
      align="center"
      width="10%"
    >
      <span slot="title">订单编号</span>
      <template slot-scope="text, record">
        <span>{{ record.ordeCode }}</span>
      </template>
    </a-table-column>
    <!-- 客户编号 -->
    <a-table-column
      v-if="port === '1'"
      key="tenantId"
      data-index="tenantId"
      align="center"
      width="8%"
    >
      <span slot="title">客户编号</span>
      <template slot-scope="text, record">
        {{ record.tenantId }}
      </template>
    </a-table-column>
    <!-- 货物信息 -->
    <a-table-column
      key="boxList"
      class="columns-tab"
      data-index="boxList"
      align="center"
      width="20%"
    >
      <div slot="title" class="columns">
        <div>货物编号</div>
        <div>自定义编号</div>
        <div>箱数</div>
      </div>
      <!-- 表格 -->
      <template slot-scope="text, record">
        <ul class="boxSkuList-list">
          <li>
            {{ record.goodsBoxNo }}
          </li>
          <li>
            {{ record.customBoxNo }}
          </li>
          <li>
            {{ record.boxTotal }}
          </li>
        </ul>
      </template>
    </a-table-column>
    <!-- 总箱数 -->
    <a-table-column
      class="businesstype"
      key="total"
      data-index="total"
      align="center"
      width="8%"
    >
      <span slot="title">剩余数量(箱)</span>
      <template slot-scope="text, record">
        {{ record.total }}
      </template>
    </a-table-column>
    <!-- 币种 -->
    <a-table-column
      key="currency"
      data-index="currency"
      align="center"
      width="10%"
    >
      <span slot="title">币种</span>
      <template slot-scope="text, record">
        <span>{{ record.currency }}</span>
      </template>
    </a-table-column>
    <!-- 费用 -->
    <a-table-column
      key="expenses"
      data-index="expenses"
      align="center"
      width="10%"
    >
      <span slot="title">费用</span>
      <template slot-scope="text, record">
        {{ record.expenses }}
      </template>
    </a-table-column>

    <!-- 接收时间 -->
    <a-table-column
      key="receivingTime"
      data-index="receivingTime"
      align="center"
      width="12%"
    >
      <span slot="title">接收时间</span>
      <template slot-scope="text, record">
        <span>{{ record.receivingTime.replace("T", " ") }}</span>
      </template>
    </a-table-column>
    <!-- 结算时间 -->
    <a-table-column
      key="endtime"
      data-index="endtime"
      align="center"
      width="12%"
    >
      <span slot="title">结算时间</span>
      <template slot-scope="text, record">
        <span>{{ record.settlementTime.replace("T", " ") }}</span>
      </template>
    </a-table-column>
    <!-- 状态 -->
  </a-table>
</template>

<script>
export default {
  props: ["transferTable"],
  data() {
    return {
      port: sessionStorage.getItem("terminal"),
    };
  },
  created() {},
  methods: {},
};
</script>

<style lang="less" scoped>
.checkTable {
  .isfast {
    display: inline-block;
    background-color: #00bfbf;
    color: #fff;
    height: 24px;
    font-size: 12px;
    width: 24px;
    border: 1px solid #000;
    line-height: 20px;
    border-radius: 12px;
  }
}
.action {
  a {
    border-bottom: 1px solid rgb(41, 41, 224);
    color: rgb(41, 41, 224);
  }
}
/deep/.columns-tab {
  width: 10% !important;
  .columns {
    display: flex;
    div:nth-child(1) {
      width: 120px;
      text-align: center;
      border: 1px solid #ccc;
    }
    div:nth-child(2) {
      width: 150px;
      text-align: center;
      border: 1px solid #ccc;
    }
    div:nth-child(3) {
      width: 60px;
      text-align: center;
      border: 1px solid #ccc;
    }
  }
}
.boxSkuList-list {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  li {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ccc;
    padding: 3px 0;
  }
  li:nth-child(1) {
    width: 120px;
  }
  li:nth-child(2) {
    width: 150px;
  }
  li:nth-child(3) {
    width: 60px;
  }
}
</style>
